
<template>
	<div class="WD-from-main">
		<div class="WD-from-auto">
			<div class="from-auto-con">
				<ul>
					<li>
						<div class="from-auto-left">
							提现说明
						</div>
						<div class="from-auto-right">
							<p>1.周一到周五工作日期间,每天可提现一次(9:00-18:00)</p>
							<p>2.发起提现日起1-3个工作日（72小时内）到账</p>
							<p>提现手续费相关规定:</p>
							<p>(1)每次最少提现200元</p>
							<p>(2)提现金额200-1999区间,需1%的提现手续费,手续费封顶5元</p>
							<p>(3)提现金额2000元以上,免手续费</p>
							<p>(4)提现金额需要是1的倍数</p>
							<p>4.加急提现,实施到账;收取1%手续费,手续费封顶50元</p>
							<p class="WD-redColor">PS:VIP会员享受每月前两次提现免手续费</p>
						</div>
					</li>
					<li>
						<div class="from-auto-left WD-lineHeight">
							提现账户
						</div>
						<div class="from-auto-right">
							<select @change="changeType">
								<option value="balance">本金账户</option>
								<option value="servicefee">佣金账户</option>
							</select>
						</div>
					</li>
					<li>
						<div class="from-auto-left WD-lineHeight">
							手机号
						</div>
						<div class="from-auto-right">
							<input disabled="disabled" class="WD-dis" type="text" v-model="submit.mobile" />
						</div>
					</li>
					<li>
						<div class="from-auto-left WD-lineHeight">
							姓名
						</div>
						<div class="from-auto-right">
							<input disabled="disabled" v-model="submit.buyerName" class="WD-dis" type="text"/>
						</div>
					</li>
					<li>
						<div class="from-auto-left WD-lineHeight">
							银行账户
						</div>
						<div class="from-auto-right">
							<input disabled="disabled" v-model="submit.toAccount" class="WD-dis" type="text" placeholder=""/>
						</div>
					</li>
					<li>
						<div class="from-auto-left WD-lineHeight">
							提现金额
						</div>
						<div class="from-auto-right">
							<input class="WD-back-none" :disabled="id" type="text" v-model.trim.number="submit.withdrawMoney"/>
							<span>
								(余额<a>{{moneyData[type]}}</a>元)
							</span>
						</div>
					</li>
					<li  v-if="false">
						<div class="from-auto-left WD-lineHeight">
							加急提现
						</div>
						<div class="from-auto-right">
							<label>
								<input type="radio" name="btn" class=""/>
								<a>是</a>
							</label>
							<label>
								<input type="radio" name="btn" class=""/>
								<a>否</a>
							</label>
						</div>
					</li>
				</ul>
			</div>
			<!-- btn -->
			<div class="WD-box-btn" v-if="!id" @click="submitInfo">确认</div>
		</div>
		<!-- fixed -->
		<div class="fixed-nav">
			<index-footer></index-footer>
		</div>
	</div>
</template>


<script>
	import IndexFooter from '@/components/base/IndexFooter'
  import {userService} from '#/service'
  import {mapGetters} from 'vuex'
	export default{
		name:'wdFrom',
    data(){
		  return {
		    id:'',
		    moneyData:{},
        type:'balance',
        submit:{
          buyerId:"",
          buyerName:'',
          toAccount:'',
          mobile:'',
          withdrawMoney:null
        }
      }
    },
    created(){
		  this.id=this.$route.query.id
      if(this.id){
        userService.withdrawDetail({
          method:'get',
          url:`/buyer/buyer_withdraw_detail/${this.id}`,
          success:(res)=>{
            this.submit=Object.assign({},this.submit,res.data)
          }
        })
      }else if(this.user.buyerBankList&&this.user.buyerBankList.length>0){
        let info=this.user.buyerBankList[0]
        this.submit.buyerName=info.acountName
        this.submit.toAccount=info.bankNo

      }
      this.submit.mobile=this.user.mobile
      userService.balance({
        success:(res)=>{
          this.moneyData=res.data
        }
      })
    },
    methods:{
      changeType($event){
        this.type=$event.target.value
      },
      async submitInfo(){
        if(!this.submit.withdrawMoney){
          this.$toast({
            message: '必须输入金额',
            position: 'middle',
            duration: 2000
          })
        }else if(isNaN(this.submit.withdrawMoney*1)){
          this.$toast({
            message: '必须输入数字',
            position: 'middle',
            duration: 2000
          })
        }else if(this.submit.withdrawMoney<=0){
          this.$toast({
            message: '必须是一个大于0的输',
            position: 'middle',
            duration: 2000
          })
        }else if(this.submit.withdrawMoney>this.moneyData[this.type]){
          this.$toast({
            message: '不能大于余额',
            position: 'middle',
            duration: 2000
          })
        }else{
          let key='withdrawApply'
          if(this.type!=='balance'){
            key='buyerWithdrawApply'
          }
          userService[key]({
            data:{withdrawMoney:this.submit.withdrawMoney},
            success:()=>{
              this.$router.push({
                name:'withdrawDeposit'
              })
            }
          })
        }
      }
    },
    computed:{
      ...mapGetters([
        'user'
      ])
    },
		components: {
			IndexFooter
		}
	}
</script>

<style>
	.WD-from-main{
		width:100%;
		height: 100%;
		padding-bottom: 0.5rem;
		overflow-y: auto;
	}
	.WD-from-auto{
		width: 95%;
		margin: 0 auto;
		overflow: auto;
	}
	.from-auto-con{
		width: 100%;
		height: auto;
	}
  .from-auto-con input{
    color: black;
  }
	.from-auto-con ul li{
		width: 100%;
		height: auto;
		float:left;
		margin-top: 0.1rem;
	}
	.from-auto-left{
		float:left;
		width: 0.6rem;
		color: #333;
		font-size: 0.14rem;
		margin-right: 0.1rem;
	}
	.from-auto-right{
		float:left;
		width: 2.78rem;
		height: auto;
		position: relative;
	}
	.from-auto-right p{
		width: 100%;
		margin-bottom: 0.05rem;
		float:left;
		color: #333;
		font-size: 0.14rem;
	}
	.from-auto-right .WD-redColor{
		color: red;
	}
	.from-auto-right select{
		width: 1.5rem;
		height: 0.32rem;
		float:left;
		outline: none;
		line-height: 0.32rem;
		font-size: 0.14rem;
	}
	.WD-lineHeight{
		line-height: 0.32rem;
	}
	.from-auto-right .WD-back-none{
		background: inherit;
		width: 1.7rem;
	}
	.from-auto-right input{
		width: 100%;
		height: 0.22rem;
		outline: none;
		border: 0.01rem solid #e6e6e6;
		float:left;
		padding: 0.05rem 0 0.05rem 0.1rem;
		background: #f5f5f5;
		font-size: 0.14rem !important;
	}
	.from-auto-right span{
		position: absolute;
		right: 0;
		top: 0.1rem;
		font-size: 0.12rem;
	}
	.from-auto-right span a{
		display: inline-block;
		color: red;
		font-size: 0.12rem;
	}
	.from-auto-right label{
		display: inline-block;
		float:left;
		line-height: 0.32rem;
		margin-right: 0.2rem;
	}
	.from-auto-right label input{
		float:left;
		width: 0.2rem;
		height: 0.2rem;
		margin: 0.05rem 0.05rem 0 0;
		vertical-align: middle;
	}
	.from-auto-right label a{
		display: inline-block;
		float:left;
		font-size: 0.14rem;
		color: #333;
	}
	.WD-box-btn{
    margin-top: 20px;
		float:left;
		width: 0.5rem;
		height: 0.3rem;
		margin-left: 0.65rem;
		line-height: 0.3rem;
		background: #0C92F3;
		color: white;
		text-align: center;
		cursor: pointer;
		font-size: 0.12rem;
	}
</style>
